<template>
  <div class="app-container">
    <el-scrollbar style="height: 100%;">
      <div class="echarts-item">
        <div class="echarts-title">
          {{ echartsData.all.title }}
        </div>
        <el-row :gutter="15" class="echarts-row" style="height: 280px;">
          <el-col :span="24">
            <line-bar-pie :echartsData="echartsData.all"></line-bar-pie>
          </el-col>
        </el-row>
      </div>
      <el-row>
        <el-col :span="8">
          <div class="echarts-item">
            <div class="echarts-title">
              {{ echartsData.yuanshui.title }}
            </div>
            <el-row :gutter="15" class="echarts-row" style="height: 280px;">
              <el-col :span="24">
                <line-bar :echartsData="echartsData.yuanshui"></line-bar>
              </el-col>
            </el-row>
          </div>
        </el-col>
        <el-col :span="8">
          <div class="echarts-item">
            <div class="echarts-title">
              {{ echartsData.zhishui.title }}
            </div>
            <el-row :gutter="15" class="echarts-row" style="height: 280px;">
              <el-col :span="24">
                <line-bar :echartsData="echartsData.zhishui"></line-bar>
              </el-col>
            </el-row>
          </div>
        </el-col>
        <el-col :span="8">
          <div class="echarts-item">
            <div class="echarts-title">
              {{ echartsData.shoushui.title }}
            </div>
            <el-row :gutter="15" class="echarts-row" style="height: 280px;">
              <el-col :span="24">
                <line-bar :echartsData="echartsData.shoushui"></line-bar>
              </el-col>
            </el-row>
          </div>
        </el-col>


      </el-row>


    </el-scrollbar>
  </div>
</template>

<script>
  import LineBarPie from '@/components/echarts/LineBarPie'  //客服
  import LineBar from '@/components/echarts/LineBar'  //客服
  import Pie from '@/components/echarts/Pie'  //客服
  export default {
    mounted() {
      this.$store.commit('rdefaultActive', 'slsj')
    },
    components: {
      LineBarPie,
      LineBar,
      Pie
    },
    data() {
      return {
        n: 2,
        echartsData: {
          all: {
            title: '水量数据分析报表',
            dataset: [
              ['product', '2018-04', '2018-05', '2018-06', '2018-07', '2018-08', '2018-09', '2018-10', '2018-11', '2018-12', '2019-01', '2019-02', '2019-03', '2019-04'],
              ['原水水量', 976.63, 990.89, 931.75, 956.21, 954.47, 960.02, 947.92, 921.77, 918.93, 901.31, 932.17, 973.55, 977.22],
              ['制水水量', 942.49, 958.95, 903.47, 945.25, 921.77, 956.36, 941.66, 906.3, 912.69, 894.57, 889.08, 953.27, 973.62],
              ['出水水量', 928.42, 939.51, 882.42, 929.02, 908.12, 955.32, 940.46, 895.11, 905.14, 876.85, 883.85, 938.17, 949.79],
              ['制水回收率', 96.5, 96.78, 96.96, 98.85, 96.57, 99.62, 99.34, 98.32, 99.32, 99.25, 95.38, 97.92, 99.63],
              ['出水回收率', 98.51, 97.97, 97.67, 98.28, 98.52, 99.89, 99.87, 98.77, 99.17, 98.02, 99.41, 98.42, 97.55],
            ],
            pieLength: 3,
            unitName: ['km³', '%'],
            yAxis: [
              {
                min: 800,
                max: 1000,
                name: '水量(km³)',
                formatter: '{value}'
              }, {

                name: '回收率(%)',
                min: 80,
                max: 100,
                formatter: '{value}'
              }
            ]
          },
          yuanshui: {
            title: '原水水量环比同比分析',
            dataset: [
              ['product', '1月', '2月', '3月', '4月', '5月', '6月'],
              ['2018', 969.67, 917.35, 905.82, 976.63],
              ['2019', 901.31, 932.17, 973.55, 977.22],
              ['同比增长率', -7.05, 1.62, 7.48, 0.06],
              ['环比增长率', -1.92, 3.42, 4.44, 0.38],
            ],
            pieLength: 2,
            unitName: ['km³', '%'],
            yAxis: [
              {
                min: 800,
                max: 1000,
                name: '原水水量(km³)',
                formatter: '{value}'
              },
              {
                name: '增长率(%)',
                min: -10,
                max: 10,
                formatter: '{value}'
              }
            ]
          },
          zhishui: {
            title: '制水水量环比同比分析',
            dataset: [
              ['product', '1月', '2月', '3月', '4月', '5月', '6月'],
              ['2018', 943.57,881.76,899.46,942.49],
              ['2019', 894.57,889.08,953.27,973.62],
              ['同比增长率', -5.19,0.83,5.98,3.3],
              ['环比增长率', -1.99,-0.61,7.22,2.13],
            ],
            pieLength: 2,
            unitName: ['km³', '%'],
            yAxis: [
              {
                min: 800,
                max: 1000,
                name: '原水水量(km³)',
                formatter: '{value}'
              },
              {
                name: '增长率(%)',
                min: -10,
                max: 10,
                formatter: '{value}'
              }
            ]
          },
          shoushui: {
            title: '售水水量环比同比分析',
            dataset: [
              ['product', '1月', '2月', '3月', '4月', '5月', '6月'],
              ['2018', 930.55,864.39,886.52,928.42],
              ['2019', 876.85,883.85,938.17,949.79],
              ['同比增长率', -5.77,2.25,5.83,2.3],
              ['环比增长率', -3.13,0.8,6.15,1.24],
            ],
            pieLength: 2,
            unitName: ['km³', '%'],
            yAxis: [
              {
                min: 800,
                max: 1000,
                name: '原水水量(km³)',
                formatter: '{value}'
              },
              {
                name: '增长率(%)',
                min: -10,
                max: 10,
                formatter: '{value}'
              }
            ]
          }
        }
      }
    },
    methods: {}
  }
</script>

<style scoped>

</style>
